| 月日 | 会議室A | 会議室B | 会議室C |
|---|---|---|---|
| 12月4日 | × | × | × |
| 12月5日 | ○ | × | ○ |
| 12月6日 | ○ | ○ | ○ |
| 12月7日 | ○ | × | ○ |
| 12月8日 | × | ○ | ○ |
|
<HTML> <HEAD> <TITLE>魅せるホームページ作成講座</TITLE> <STYLE type="text/css"> TABLE{ background-color:#009900; border:12px #FFCC00 ridge; border-collapse:collapse; } TH{ background-color:#009900; border-left:1px #FFFFFF dashed; padding:10px; font-size:16pt; font-weight:bold; color:#FFFFFF; } TH.md{ background-color:#009900; border-right:2px #FFFFFF solid; padding:10px; font-size:16pt; font-weight:bold; color:#FFFFFF; } TD{ background-color:#FFFFFF; border:1px #FFFFFF dashed; padding:10px; font-size:16pt; font-weight:bold; text-align:center; } TD.red{ color:#FF0000; } TD.md{ background-color:#CCFFCC; border:1px #FFFFFF dashed; border-right:2px #009900 solid; padding:10px; font-size:16pt; font-weight:bold; text-align:center; } </STYLE> </HEAD> <BODY> <H1>表のデザイン</H1> <TABLE> <TR><TH class="md">月日</TH><TH>会議室A</TH><TH>会議室B</TH><TH>会議室C</TH></TR> <TR><TD class="md">12月4日</TD><TD class="red">×</TD><TD class="red">×</TD><TD class="red">×</TD></TR> <TR><TD class="md">12月5日</TD><TD>○</TD><TD class="red">×</TD><TD>○</TD></TR> <TR><TD class="md">12月6日</TD><TD>○</TD><TD>○</TD><TD>○</TD></TR> <TR><TD class="md">12月7日</TD><TD>○</TD><TD class="red">×</TD><TD>○</TD></TR> <TR><TD class="md">12月8日</TD><TD class="red">×</TD><TD>○</TD><TD>○</TD></TR> </TABLE> </BODY> </HTML> |
| 注） | このサンプルは、Internet Explorer 6.0を対象ブラウザとして作成されています。そのため、その他のブラウザでは表示に違いが見られますが、ご了承くださいますようお願いいたします。 |